<template>
    <a-spin :spinning="isLoading" tip="处理中...">
        <div id="app">
            <a-config-provider :locale="locale">
                <router-view />
            </a-config-provider>
        </div>
        <audio id='audio' crossOrigin="anonymous" style='opacity:0,width:0,height:0' preload="auto" />
    </a-spin>
</template>
<script>
import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN';
import { mapState } from 'vuex';
import { hasPermPage } from '@/utils/permission';
import moment from 'moment';
import 'moment/locale/zh-cn';
moment.locale('zh-cn');

export default {
    name: 'App',
    data() {
        return {
            locale: zhCN,
            warnAudio:require('@/assets/audio/alarm.wav'),
            onAudio:require('@/assets/audio/online.mp3'),
            offAudio:require('@/assets/audio/offline.wav'),
        };
    },
    computed: {
        ...mapState({
            isAudio: state => state.setting.isAudio,
            isLoading: state => state.setting.isLoading,
            warningAudio: state => state.setting.warningAudio,
            taskAudio: state => state.setting.taskAudio,
            commonAudio: state => state.setting.commonAudio
        })
    },
    methods: {
        /**
         * item  提示的对象内容
         * topic 消息主题 鉴别什么类型的消息
         * isTip 是否需要提示内容
         * （用于初始化手动触发）
         */
        setAudio(item, topic, isTip = true) {
            let {messageType='',messageId='',messageContent=''} = item;
            const key = messageId;
            let title = '';
            let audioUrl = '';
            let duration = 0;
            let iconItem = '';

            if (topic.indexOf('schemeMessage') >= 0) {
                //任务消息通知
                title = messageType;
                if(this.taskAudio){
                    audioUrl = this.onAudio;
                }
                iconItem = <a-icon type="bell" style="color: #91cc75" />;
            } else if (topic.indexOf('alarmMessage') >= 0) {
                title = messageType;
                if(this.warningAudio){
                    audioUrl = this.warnAudio;
                }
                iconItem = <a-icon type="exclamation-circle" style="color: #e15714" />;
            } else if (topic.indexOf('normalMessage') >= 0) {
                title = messageType;
                if(this.commonAudio){
                    audioUrl = this.offAudio;
                }
                iconItem = <a-icon type="safety" style="color: #91cc75" />;
            }  else {
                console.log('禁止提示');
                return false;
            }

            this.$notification.warning({
                    message: title,
                    description: messageContent,
                    duration,
                    icon: iconItem,
                    style: { wordWrap: 'break-word', whiteSpace: 'pre-wrap' },
                    onClose: async () => {
                        // this.dealTarget(messageType,messageId)
                    },
                    onClick: async () => {
                        // this.dealTarget(messageType,messageId)
                        // this.$notification.close(key);
                    },
                    btn: h => {
                        if(topic=='notice'){
                            return '';
                        }
                        return h(
                            'a-button',
                            {
                                props: {
                                    type: 'primary',
                                    size: 'small'
                                },
                                on: {
                                    click: () => {
                                        this.dealTarget(messageType,messageId)
                                        this.$notification.close(key);
                                    }
                                }
                            },
                            '查看'
                        );
                    },
                    key
                });

            const audio = document.getElementById(`audio`);
            if(audioUrl){
                audio.src = audioUrl;
                audio.play();
            }
            if(!isTip){
                audio.pause();
            }
        },
        //处理跳转
        dealTarget(theme,schemeId){
            // 施工审批 施工整改
            if(theme.indexOf('施工审批')>=0){
                let ishas = hasPermPage('/supervision/approve/index');
                if(!ishas){
                    this.$router.push({
                        path:`/supervision/approve/index`,
                        query:{
                            id:schemeId
                        }
                    })
                }else{
                    this.$message.error('暂无权限')
                }
            }else if(theme.indexOf('施工整改')>=0){
                let ishas = hasPermPage('/supervision/rectify/index');
                if(!ishas){
                    this.$router.push({
                        path:`/supervision/rectify/index`,
                        query:{
                            id:schemeId
                        }
                    })
                }else{
                    this.$message.error('暂无权限')
                }
            }else if(theme=='施工方案'){
                let ishas = hasPermPage('/construction/scheme/index');
                if(!ishas){
                    this.$router.push({
                        path:`/construction/scheme/index`,
                        query:{
                            id:schemeId
                        }
                    })
                }else{
                    this.$message.error('暂无权限')
                }
            }else if(theme=='施工计划执行'){
                let ishas = hasPermPage('/supervision/list/index');
                if(!ishas){
                    this.$router.push({
                        path:`/supervision/list/index`,
                        query:{
                            id:schemeId
                        }
                    })
                }else{
                    this.$message.error('暂无权限')
                }
            }
        },
        //清除所有弹出提示
        clearTipMessage() {
            if (this.audio) {
                this.audio.pause();
                this.audio = null;
            }
            if (this.messageKey) {
                this.$notification.close(this.messageKey);
            }
        }
    },
    provide: function() {
        let that = this;
        const provides = {
            playAudio(data, topic, isTip = true) {
                that.setAudio(data, topic, isTip);
            },
            closeAudio() {
                if (that.audio) {
                    that.audio.pause();
                    that.audio = null;
                }
            },
            clearTip() {
                that.clearTipMessage();
            }
        };
        return provides;
    }
};
</script>
<style lang="scss" scoped>
::v-deep .video-js .vjs-big-play-button {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 48px;
    line-height: 80px;
    height: 80px;
    width: 80px;
    border-radius: 100%;
}
</style>
